<template>
  <div
    class="rinbot_box"
    style="background-color: #fff; min-height: 500px; width: 1200px; margin: 0 auto"
  >
    <template v-if="cfg.route.params.id != null">
      <component :is="comp[cfg.route.params.id]" :conf="val.conf" />
    </template>
    <n-hr />
    {{ val }}
  </div>
</template>
<script>
import { cfg } from "@/cfg/cfg.js";
import { getrole } from "@/cfg/function.js";

export default {
  props: {
    guild_id: {
      type: Number,
      required: false,
    },
  },
  setup(props) {
    const set = {};
    const p = props;
    const comp = {
      cdb: defineAsyncComponent(() => import(`@/views/rinbot/cdb.vue`)),
    };
    const val = reactive({
      conf: {
        guild_id: cfg.route.params.guild_id,
      },
      qs: {
        guild_id: cfg.route.params.guild_id,
      },
    });

    onMounted(async () => {
      try {
        await getrole();
      } catch (error) {
        alert(error);
      }
    });
    return { cfg, comp, val, set, props };
  },
};
</script>
